<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>交账管理</title>
<jsp:include page="/header.jsp"></jsp:include>
<link href="${basePath }/css/ui.css" rel="stylesheet" type="text/css">
<style type="text/css"> .red{color: red;} </style>
<script type="text/javascript">
	var codeArray = new Array();

	function lockShelf() {
		var code = $("#shelfCode").val();
		if(code==""||code==null)
			$.jqalert("请输入货架二维码", "提示");
		else {
			var readonly = $("#shelfCode").attr("readonly");
			if(readonly==null)
				$("#shelfCode").attr("readonly", "readonly");
		}
	}
	
	function resetIndex() {
		$.each($("#shift-table").find("tr:gt(0)"), function(i, n){
			$(n).find("td:eq(0)").text(i+1);
		})
	}
	
	function delAll() {
		$("#shift-table").find("tr:gt(0)").html("");
		$("#productCode").val("");
		$("#shelfCode").val("");
		$("#shelfCode").removeAttr("readonly");
		codeArray = new Array();
	}
	
	function takeStock() {
		$.ajax({
			url:"${basePath}/shift/takeStock.htm",
			type:"post",
			data:{
				codes:codeArray.join(","),
				shelfCode:$("#shelfCode").val()
			},
			dataType:"json"
		}).done(function(data){
			$.jqalert(data.msg, "提示", function(){
				if(data.isSuccess)
					window.location = "${basePath}/shift/takeStockList.htm";
			})
		})
	}
	
	$(function() {
		$(window).keydown(function(event){
			switch(event.keyCode) {
				case 13:{
					var readonly = $("#shelfCode").attr("readonly");
					if(readonly==null)
						$.jqalert("请先锁定货架二维码", "提示");
					else {
						var code = $("#productCode").val();
						if(code==null||code=="")
							$.jqalert("请输入商品二维码", "提示");
						else if(codeArray.join(",").indexOf(code)!=-1) 
							$.jqalert("请勿重复扫描商品", "提示");
						else {
							$.ajax({
								url:"${basePath}/shift/scan.htm?qrcode="+code+"&shelfCode="+$("#shelfCode").val(),
								dataType:"html"
							}).done(function(data){
								if(data==""||data==null)
									$.jqalert("未找到该商品", "提示");
								else {
									$("#shift-table").append(data);
									codeArray.push(code);
									resetIndex();
								}
							})
						}
					}
				}
			}
		});
	})
</script>
</head>
<body>
	<div id="header_div" class="tab_li clearfix">
		<a href="${basePath }/shift/takeStock.htm" class="act">下班盘点</a>
        <a href="${basePath }/shift/summary.htm" class="">交账管理</a>
        <a href="${basePath }/shift/takeStockdiff.htm" class="">差异商品</a>
        <a href="${basePath }/shift/check_view.htm" class="">上班核实</a>
        <a href="${basePath }/shift/list.htm" class="">交班记录</a>
    </div>
    <div class="main">
        <div class="cont">
        	<h2 class="title">商品信息：</h2>
            <div class="ui">
                <div class="label_box" id="common_div">
                    <span class="sel_label fl">扫描货架二维码：</span>
                    <input type="text" id="shelfCode" class="text_input fl">
                    <a href="javascript:;" class="green_btn btn fl" onclick="lockShelf();">锁定</a>
                </div>
                <div class="label_box" id="temp_div">
                    <span class="sel_label fl">扫描商品二维码：</span>
                    <input type="text" id="productCode" class="text_input fl">
                </div>
            </div>
            <h2 class="title"> 查询结果：</h2>
            <div class="ui">
                <table class="table_list" id="shift-table">
                    <tr class="">
                      <th class="">序号</th>
                      <th class="">商品二维码</th>
                      <th>产品名称</th>
                      <th class="">生产年份</th>
                      <th class="">产品批次</th>
                      <th class="">规格</th>
                      <th class="">类型</th>
                      <th>单位</th>
                    </tr>
                </table>
            </div>
        </div>
        <div class="text_c">
        	<a href="javascript:;" class="yellow_btn btn" onclick="takeStock();">保存</a>
        	&nbsp;&nbsp;
        	<a href="javascript:;" onclick="delAll();">清空</a>
        </div>
    </div>
</body>
</html>